<template>
  <div>
    <h2>显示</h2>
    借款款项名称：<input type="text" v-model="sdata.J_Name" /> 利息:
    <select v-model="sdata.L_id">
      <option value="0">--请选择--</option>
      <option v-for="b in list" :value="b.L_id">
        {{ b.L_Year }}年{{ b.L_LiXi * 100 }}%
      </option>
    </select>
    <input type="button" value="查询" @click="Show()" />
    <table class="table table-bordered">
      <thead>
        <tr>
          <td>借款款项编号</td>
          <td>借款款项名称</td>
          <td>借款最高金额</td>
          <td>借款最高年限</td>
          <td>利息</td>
          <td>借款款项简介</td>
          <td>月还款金额</td>
          <td>操作</td>
        </tr>
      </thead>
      <tbody>
        <tr v-for="a in plist">
          <td>{{ a.J_Id_ }}</td>
          <td>{{ a.J_Name }}</td>
          <td>{{ a.J_MaxMoney }}</td>
          <td>{{ a.J_MaxYear }}</td>
          <td>{{ a.L_LiXi * 100 }}%</td>
          <td>{{ a.J_Info }}</td>
          <td>
            {{ ((a.J_MaxMoney * a.L_LiXi) / 12 / a.L_Year).toFixed(2) }}CNY
          </td>

          <td>
            <input type="button" value="删除" @click="shan(a.J_Id_)" />
            <input type="button" value="修改" @click="gai(a.J_Id_)" />
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script setup lang="ts">
import { reactive, toRefs, onMounted } from 'vue';
import axios from 'axios';
import { useRoute, useRouter } from 'vue-router';
let router = useRouter();
let route = useRoute();
let data = reactive({
  sdata: {
    J_Name: '',
    L_id: 0,
  },
  list: {},
  plist: {},
});
let { sdata, list, plist } = toRefs(data);

onMounted(() => {
  Bind();
  Show();
});
const Bind = () => {
  axios({
    url: 'http://localhost:64514/api/Jie/Bind',
    method: 'get',
  }).then((res) => {
    list.value = res.data.data;
  });
};
const Show = () => {
  axios({
    url: 'http://localhost:64514/api/Jie/Show',
    method: 'get',
    params: sdata.value,
  }).then((res) => {
    plist.value = res.data.data;
  });
};
const shan = (J_Id_: any) => {
  var f = confirm('确定删除吗？');
  if (f) {
    axios({
      url: 'http://localhost:64514/api/Jie/Shan',
      method: 'get',
      params: {
        J_Id_: J_Id_,
      },
    }).then((res) => {
      if (res.data.data > 0) {
        alert('删除成功');
        Show();
      }
    });
  }
};
const gai = (J_Id_: any) => {
  router.push({
    path: '/gai',
    query: {
      J_Id_: J_Id_,
    },
  });
};
</script>

<style scoped></style>
